
class setCart{
    constructor(ops){
        this.tbody = ops.tbody;
        this.amount = ops.amount;
        this.sum = ops.sum;
        this.getGoods();
    }
    // 请求后端数据
    getGoods(){
        ajaxPost("http://localhost:3000/api",(res)=>{
            this.res=JSON.parse(res)
            this.data=this.res.data
            // console.log(this.res.data)
            this.goodsMsg =localStorage.getItem("goodsMsg") ? JSON.parse(localStorage.getItem("goodsMsg")) : [];
            this.renderCart()
            // console.log(this.goodsMsg)
        },{
            type:"goods"
        })
    }
    // 渲染购物车
    renderCart(){
        let str ="";
        this.data.forEach(val1=>{
            this.goodsMsg.forEach(val2=>{
                if(val1.goodsId === val2.id){
                    if(val2.flag===1){
                        str +=`<tr index="${val2.id}">
                        <td><input type="checkbox" class="checkbox" checked="checked"></td>
                        <td><img src="${val1.proImg}" alt=""></td>
                        <td>${val1.proName}</td>
                        <td><input type="text" class="setNum" value="${val2.num}"></td>
                        <td>${val2.size}</td>
                        <td>${val2.price}</td>
                        <td>${val2.price*val2.num}</td>
                        <td class="delete">删除</td>
            
                    </tr>`
                    
                    }else{
                        str +=`<tr index="${val2.id}">
                        <td><input type="checkbox" class="checkbox"></td>
                        <td><img src="${val1.proImg}" alt=""></td>
                        <td>${val1.proName}</td>
                        <td><input type="text" class="setNum" value="${val2.num}"></td>
                        <td>${val2.size}</td>
                        <td>${val2.price}</td>
                        <td>${val2.price*val2.num}</td>
                        <td class="delete">删除</td>
            
                    </tr>`



                    }
                    this.tbody.innerHTML=str;  
                }           
            })
        })
        
        this.setNum()
        this.delete()
        this.setSum()
    }
    // 数量和商品总价修改
    setNum(){
        const that = this;
        this.tbody.oninput=function(eve){
            that.e=eve||window.event;
            that.target = that.e.target||that.e.srcElement||that.e.toElement;
            if(that.target.className==="setNum"){
                that.index=that.target.parentNode.parentNode.getAttribute("index");
                that.size=that.target.parentNode.nextElementSibling.innerHTML;
                // console.log(that.index,that.size)
                
                that.goodsMsg.some((val,idx)=>{
                    that.i=idx;
                    return val.id===that.index&&val.size===that.size
                })
                // console.log(that.goodsMsg[that.i].num)
                // 计算总价
                that.sum = that.target.value*(that.goodsMsg[that.i].price)
                that.target.parentNode.nextElementSibling.nextElementSibling.nextElementSibling.innerHTML=that.sum
                that.goodsMsg[that.i].num = that.target.value;
                that.target.value = that.goodsMsg[that.i].num;

                localStorage.setItem("goodsMsg",JSON.stringify(that.goodsMsg))
                // that.setSum()

            }else if(that.target.className==="checkbox"){
                    // let t=0;
                    that.index2=that.target.parentNode.parentNode.getAttribute("index");
                    that.size2=that.target.parentNode.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.innerHTML
                    that.goodsMsg.some((val,idx)=>{
                        that.i2=idx;
                        return val.id===that.index2&&val.size===that.size2   
                    })
                    if(that.target.checked){
                        that.goodsMsg[that.i2].flag = 1
                        localStorage.setItem("goodsMsg",JSON.stringify(that.goodsMsg))
                    
                    // console.log(that.target.parentNode.nextElementSibling.nextElementSibling.nextElementSibling.children[0].value)
                    // let xt = parseInt(that.target.parentNode.nextElementSibling.nextElementSibling.nextElementSibling.children[0].value)
                    // t+=xt
                    // f+=parseInt(that.target.parentNode.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.innerHTML)
                    
            
                    }else{
                        that.goodsMsg[that.i2].flag = 0
                        localStorage.setItem("goodsMsg",JSON.stringify(that.goodsMsg))
                    
                    // t-=parseInt(that.target.parentNode.nextElementSibling.nextElementSibling.nextElementSibling.children[0].value)
                    // f-=parseInt(that.target.parentNode.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.innerHTML)
                    }
                    // that.amount.innerHTML=t;
                    // that.sum.innerHTML=f;
            

            }
            
        }
    }
    // 总数和总价的修改
    setSum(){
        let t = 0;
        let f = 0;
        for(let i = 0;i<this.tbody.children.length;i++){
            console.log(this.tbody.children[0].children[6].innerHTML)
            if(this.tbody.children[i].children[0].children[0].checked){
                t+=parseInt(this.tbody.children[i].children[3].children[0].value)
                f+=parseInt(this.tbody.children[i].children[6].innerHTML)
            }else{
                t-=parseInt(this.tbody.children[i].children[3].children[0].value)
                f-=parseInt(this.tbody.children[i].children[6].innerHTML)
            }
            this.amount.innerHTML=t;
            this.sum.innerHTML=f;
        }
        
    }
    // 删除
    delete(){
        const that = this;
        this.tbody.onclick=function(eve){
            that.e=eve||window.event;
            that.target = that.e.target||that.e.srcElement||that.e.toElement;
            if(that.target.className==="delete"){
                that.index1=that.target.parentNode.getAttribute("index")
                that.size1=that.target.previousElementSibling.previousElementSibling.previousElementSibling.innerHTML;
                that.goodsMsg.some((val,idx)=>{
                    that.i1=idx;
                    return val.id===that.index1&&val.size===that.size1
                })
                that.goodsMsg[that.i1]=""
                localStorage.setItem("goodsMsg",JSON.stringify(that.goodsMsg))
                that.renderCart()

            }
        }
    }
    // 







}
    


new setCart({
    tbody : document.querySelector("tbody"),
    amount : document.querySelector("#amount"),
    sum : document.querySelector("#sum")

})